<template>
  <BasicModal v-bind="$attrs" @register="registerModal" destroyOnClose title="MRP计算结果" :width="1024"
    @ok="handleSubmit">
    <a-tabs v-model:activeKey="activeKey" @change="handleChangeTabs" type="card">
      <a-tab-pane tab="MRP计算结果" key="mrpResult" :forceRender="true">
        <a-table :dataSource="mrpResultData.dataSource" :columns="mrpResultData.columns" bordered :scroll="{ x: 2000 }" />
      </a-tab-pane>
    </a-tabs>
  </BasicModal>
</template>

<script lang="ts" setup>
  import {
    ref,
    computed,
    unref,
    reactive
  } from 'vue';
  import {
    BasicModal,
    useModalInner,
    useModal
  } from '/@/components/Modal';
  import {
    BasicForm,
    useForm
  } from '/@/components/Form/index';
  import {
    useJvxeMethod
  } from '/@/hooks/system/useJvxeMethods.ts';
  import mpsSelectModel from '/@/views/components/mpsSelectModel.vue';
  import {
    mrpResultColumns
  } from '../PsPlanOrder.data';
  import {
    psPlanOrderResultList
  } from '../PsPlanOrder.api';
  import {
    VALIDATE_FAILED
  } from '/@/utils/common/vxeUtils'
  //表单赋值
  const [registerModal, {
    setModalProps,
    closeModal
  }] = useModalInner(async (data) => {
    //重置表单
    await reset();
    console.log("data", data);
    getMrpResult(data.record.id);
    setModalProps({
      confirmLoading: false,
      showCancelBtn: false,
      showOkBtn: false
    });
  });
  const refKeys = ref(['mrpResult']);
  const activeKey = ref('mrpResult');
  const mrpResultData = reactive({
    dataSource: [],
    columns: mrpResultColumns,
  });

  async function reset() {
    // await resetFields();
  }
  async function getMrpResult(id) {
    const result = await psPlanOrderResultList(id);
    mrpResultData.dataSource = result;
  }

</script>

<style lang="less" scoped>
  /** 时间和数字输入框样式 */
  :deep(.ant-input-number) {
    width: 100%
  }

  :deep(.ant-calendar-picker) {
    width: 100%
  }

</style>
